<template>
  <div class="enterPrise">
    <div class="baseBox">
      <div class="before-begin" v-show="!isShowAddOrEdit">
        <div class="enterPrise-logo">
          <img src="../../../../../assets/img/qiyeweixin.png" alt=""/>
          <span>
              <p>
                {{$t('configLazyLoad.channel.enterpriseTip1')}}</br>
                {{$t('configLazyLoad.channel.enterpriseTip01')}}
              </p>
              <p class="textSecond" v-show="!$store.state.oemObj.oemFlag">
                {{$t('configLazyLoad.channel.enterpriseTip2')}}</br>
                {{$t('configLazyLoad.channel.enterpriseTip02')}}
              </p>
              <p class="textSecond" v-show="$store.state.oemObj.oemFlag">
                {{$t('configLazyLoad.channel.enterpriseTip2')}}</br>
                {{$t('configLazyLoad.channel.enterpriseTip02Oem')}}
              </p>
            </span>
        </div>
        <!-- <div class="enterEnterPrise" @click="addFun">{{$t('configLazyLoad.channel.enterpriseTip3')}}</div> -->
      </div>
      <enterpriseTable ref="enterpriseTable" v-show="!isShowAddOrEdit" @addFun="addFun" @enterpriseEditFun="editFun"></enterpriseTable>
      <addOrEdit v-if="isShowAddOrEdit" :configFormData="configFormData" :showAddOrEditType="showAddOrEditType" :authMode="authMode" @backFun="backFun" :wechatUrl="wechatUrl"></addOrEdit>
    </div>
  </div>
</template>
<script>
  import enterpriseTable from './enterpriseTable'
  import addOrEdit from './addOrEdit'
  import bus from '@/store/eventBus'
  export default {
    name: 'enterPriseList',
    data () {
      return {
        isShowAddOrEdit: false,
        showAddOrEditType: 'add',
        authMode: '',
        configFormData: {},
        wechatUrl: ''
      }
    },
    components: {
      enterpriseTable,
      addOrEdit
    },
    methods: {
      addFun (authMode) {
        this.showAddOrEditType = 'add'
        this.authMode = authMode
        this.wechatUrl = this.$refs.enterpriseTable.wechatUrl
        this.isShowAddOrEdit = true
      },
      backFun () {
        this.isShowAddOrEdit = false
      },
      editFun (data) {
        this.authMode = data.authMode
        this.wechatUrl = data.wechatUrl
        this.showAddOrEditType = 'edit'
        this.isShowAddOrEdit = true
        this.configFormData = data.editData
      }
    },
    beforeMount () {
      bus.$on('enterpriseCancel', () => {
        this.isShowAddOrEdit = false
      })
      bus.$on('enterpriseSaveFun', () => {
        this.isShowAddOrEdit = false
      })
      bus.$on('enterpriseUpdate', () => {
        this.isShowAddOrEdit = false
      })
    },
    destroyed () {
      bus.$off('enterpriseCancel')
      bus.$off('enterpriseSaveFun')
      bus.$off('enterpriseUpdate')
    }
  }
</script>
<style lang="stylus" scoped>
  @import "../../../../../assets/common.styl"
  .baseBox
    height calc(100vh - 170px)
    overflow-y auto
    .before-begin
      text-align: center
      margin 25px
      background #f2f6fa
      height 202px
      .enterPrise-logo
        padding 34px 0 10px 0
        display table
        margin 0 auto
      .enterPrise-logo > img
        width 71px
        height 71px
      .enterPrise-logo > span
        display table-cell
        vertical-align middle
        margin-left 10px
      .enterPrise-logo > span > p
        line-height 1.8
        margin-left 14px
        text-align left
        color #595959
        font-size 12px
      .enterPrise-logo > span > .textSecond
        color #000000
        margin-top 8px
      .enterEnterPrise
        cursor pointer
        width auto
        padding 0 10px
        height 30px
        margin-top 6px
        line-height 30px
        border-radius 3px
        color #ffffff
        display inline-block
        background-color #459AE9
</style>
